<template>
	<view class="container">
		<view class="panel-header padding-top solid-bottom">
			<view class="g-goBack" @click="$utils.toBack()">
				<view class="cuIcon-back"></view>
			</view>
			<view class="text-cut">{{title}}</view>
		</view>
		<form>
			<view class="cu-form-group">
				<view class="title">模版名称</view>
				<view class="text-gray padding-right-sm">{{templateTitle}}</view>
			</view>
			<view class="cu-form-group">
				<view class="title">电池类型</view>
				<view class="text-gray padding-right-sm">{{info.batteryTypeName}}</view>
			</view>
			<view class="cu-form-group">
				<view class="title">价格类型</view>
				<view class="text-gray padding-right-sm">普通
					<text v-if="info.state == 1">（全局价格）</text>
					<text v-if="info.state == 2" class="text-orange">（自定义价格）</text>
				</view>
			</view>
			<view class="cu-form-group">
				<view class="title">押金(元)</view>
				<input placeholder="请填写(必填项)" v-model="info.depositPrice"></input>
			</view>
			<view class="cu-form-group">
				<view class="title">租借价格(元/日)</view>
				<input placeholder="请填写(必填项)" v-model="info.dayPrice"></input>
			</view>
			<view class="cu-form-group margin-top">
				<view class="title">价格类型</view>
				<view class="text-gray padding-right-sm">白名单</view>
			</view>
			<view class="cu-form-group">
				<view class="title">是否启用<text class="text-red">(关闭则删除)</text></view>
				<view><switch class="switch-func" :class="freeMemberState == 2?'checked':''"
							:checked="freeMemberState == 2?true:false" @change="freeMemberStateChange"/></view>
			</view>
			<view class="cu-form-group">
				<view class="title">押金(元)</view>
				<input placeholder="请填写(必填项)" v-model="info1.depositPrice"></input>
			</view>
			<view class="cu-form-group">
				<view class="title">租借价格(元/日)</view>
				<input placeholder="请填写(必填项)" v-model="info1.dayPrice"></input>
			</view>
			<view class="cu-bar btn-group margin-top">
			    <button class="cu-btn bg-grey shadow-blur round" @click="$utils.toBack()">取消</button>
				<button class="cu-btn bg-orange shadow-blur round" @click="btnSaveSubmit()">确定</button>
			</view>
		</form>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title:'编辑电池类型价格',
				templateId:null,
				templateTitle:null,
				info:{},
				info1:{},
				freeMemberState:2,
				listData:[],
				typeIndex:0
			};
		},
		onLoad(option) {
			const _self = this;
			const eventChannel = this.getOpenerEventChannel();
			eventChannel.on('fromData', function(data) {
			    console.log(data)
				_self.templateId = data.templateId;
				_self.templateTitle = data.templateTitle;
				if(data.costItems && data.costItems.length > 0){
					for(let i =0;i<data.costItems.length;i++){
						let costItem = data.costItems[i];
						if(costItem.type == 1){
							_self.info = {
								type:1,
								batteryTypeId:data.batteryTypeId,
								batteryTypeName:data.batteryTypeName,
								depositPrice:costItem.depositPrice,
								dayPrice:costItem.dayPrice,
								state:costItem.state
							};
						}else if(costItem.type == 2){
							_self.freeMemberState = 2;
							_self.info1 = {
								type:2,
								batteryTypeId:data.batteryTypeId,
								batteryTypeName:data.batteryTypeName,
								depositPrice:costItem.depositPrice,
								dayPrice:costItem.dayPrice
							};
						}
					}
				}
			})
		},
		methods:{
			freeMemberStateChange:function(e){
				console.log(e);
				var state = 1;
				if(e.detail.value){
					state = 2;
				}
				this.freeMemberState = state;
			},
			btnSaveSubmit:function(){
				var formInfo = {
					templateId:this.templateId,
					batteryTypeId:this.info.batteryTypeId,
					items:[{
						type:1,
						depositPrice:this.info.depositPrice,
						dayPrice:this.info.dayPrice
					}]
				}
				formInfo.items.push({
					type:2,
					depositPrice:this.info1.depositPrice,
					dayPrice:this.info1.dayPrice,
					toDel:this.freeMemberState == 1
				})
				const _self = this;
				const api = this.$request;
				api.post(api.url.bxscnShopFeeItemSave,formInfo,res=>{
					console.log(res);
					if(res.code==200){
						uni.showToast({
							title:'保存成功',
							icon:'success'
						})
						setTimeout(function(){
							uni.navigateBack();
						},1000)
					}else if(res.msg){
						uni.showModal({
							title:'保存失败',
							content:res.msg,
							showCancel:false
						})
					}else {
						uni.showToast({
							title:'保存失败',
							icon:'error'
						})
					}
				})
			}
		}
	}
</script>

<style lang="less">
.container .cu-form-group{text-align:right;}
</style>
